<!--
* description: 车系编码弹出框
* author: ydche
* createdDate: 2019-11-6
-->
<template>
  <section class="carTypeConfig">
    <el-dialog
      v-dialogDrag
      title="车系选择(单选)"
      :visible.sync="curPopupsVisible"
      width="900px"
      center
      @close="sendCode"
      :close-on-click-modal="false"
      :append-to-body="true"
      ref="dialogMultipleTable"
    >
      <one-table-template
        ref="multipleTable"
        :dynamicButtons="tableButtons"
        :dynamicComponents="tableComponents"
        :dynamicApiConfig="apiConfig"
        :dynamicTableCols="tableCols"
        :dynamicFormFields="formField"
        :dynamicIsShowSelect="false"
        :key="popupsTableKey"
      />
    </el-dialog>
  </section>
</template>
<script>
import { oneTableWithViewTemplateMixins } from "@/components/mixins/oneTableWithViewTemplateMixins";
import { valueObjectMixins } from "@/components/mixins/valueObjectMixins";
import OneTableTemplate from "@/components/crm/commonComponents/crmPopupsOneTable";
import { seApis } from "@/api/apiList/se";
import { doChooseCarSeries } from "@/api/se/basedata/seChooseCarSeries";
export default {
  // 组件混入对象：{data[listQuery] methods[queryTable]}
  mixins: [oneTableWithViewTemplateMixins, valueObjectMixins],
  components: {
    OneTableTemplate
  },
  data() {
    return {
      // isMul: false,
      // 弹窗页面标识
      popupsPageCode: "/components/org/selectCarSeries/selectCarSeries",
      // 网格查询API配置对象
      apiConfig: seApis.mdmVeCarSeriesQueryListForPage,
      // 动态组件-按钮
      tableButtons: [
        {
          compKey: "btnKey1",
          type: "primary",
          name: "search",
          position: "right",
          fuzzySearch: true,
          size: "small",
          clickEvent: () => this.queryTable(1),
          text: this.$t("sys.button.query"),
          position: "top"
        }, //查询
        {
          compKey: "btnKey4",
          type: "primary",
          size: "small",
          name: "export",
          position: "right",
          clickEvent: () => this.sendCode(this.codeField, "carSeriesCn"),
          text: "确认",
          position: "bottom"
        }, //选择
        {
          compKey: "btnKey2",
          type: "",
          size: "small",
          name: "reset",
          position: "right",
          clickEvent: () => this.reset(),
          text: this.$t("sys.button.reset"),
          position: "top"
        } //重置
      ],
      // 动态组件-查询条件
      tableComponents: [],
      // 静态组件-查询条件
      staticTableComponents: [
        {
          compKey: "compKey1",
          labelName: this.$t("org.label.carBrand") /**品牌*/,
          codeField: "carBrandCode",
          component: () => import("@/components/org/carBrand/carBrand"),
          type: "dropdownList",
          isMust: true
        },
        {
          compKey: "compKey3",
          labelName: "车系编码",
          codeField: "carSeriesCode",
          component: () => import("@/components/org/commonInput"),
          type: "inputText",
          isMust: true
        }, //'备件编码'
        {
          compKey: "compKey2",
          labelName: "车型名称",
          codeField: "carSeriesCn",
          component: () => import("@/components/org/commonInput"),
          type: "inputText",
          isMust: true
        } //'备件名称'
      ],
      // 动态生成网格列
      tableCols: [],
      // 静态生成网格列
      staticTableCols: [
        {
          prop: "carBrandCode",
          label: "车辆品牌",
          width: null,
          align: "center",
          hidden: true
        }, //车辆品牌
        {
          prop: "mdmCarBrandExtend.carBrandCn",
          label: "车辆品牌",
          width: null,
          align: "center"
        }, //车辆品牌名称
        {
          prop: "carSeriesCode",
          label: "车系编码",
          width: null,
          align: "center"
        }, //车辆编码
        {
          prop: "carSeriesCn",
          label: "车系中文名",
          width: null,
          align: "center"
        }, //车系中文名
        {
          prop: "carSeriesEn",
          label: "车系英文名",
          width: null,
          align: "center"
        } //车系英文名
      ],
      //表单查询数据（查询条件）
      formField: {
        carBrandCode: "",
        carSeriesCode: "",
        carSeriesCn: ""
      },
      clickRowsData: {}
    };
  },
  methods: {
    selectRowsData(row) {
      this.clickRowsData = row;
    },
    sendCode(arrayCodeField, arrayTextField) {
      // 获取嵌套组件的选中的值
      const that = this.$refs.multipleTable;
      let selectData = [];
      selectData.push(this.clickRowsData);
      if (selectData && selectData.length > 0) {
        let tmpCodeField = arrayCodeField;

        let tmpTextField = arrayTextField;

        this.modelCode = this.$utils.getArrayFromJsonArray(
          selectData,
          tmpCodeField
        );
        this.modelText = this.$utils.getArrayFromJsonArray(
          selectData,
          tmpTextField
        );
      } else {
        this.modelCode = [];
        this.modelText = [];
      }
      var code =
        typeof this.modelCode === "string"
          ? this.modelCode
          : this.modelCode.join(",");
      var text =
        typeof this.modelText === "string"
          ? this.modelText
          : this.modelText.join(",");
      this.$emit(
        "changeCode",
        code,
        text,
        this.codeField,
        this.comType,
        this.popupsKey,
        this.textField,
        this.otherField,
        selectData
      );
    }
  }
};
</script>
